<template>
  <view>
    <up-tabbar
      :value="tabbarValue"
      @change="tabbarChange"
      :fixed="true"
      :placeholder="false"
      activeColor="#d81e06"
      :safeAreaInsetBottom="false"
    >
      <up-tabbar-item
        :text="item.text"
        :icon="item.icon"
        @click="tabbarChange(index)"
        v-for="(item, index) in tabbarList"
        :key="index"
      ></up-tabbar-item>
    </up-tabbar>
  </view>
</template>

<script setup>
import { ref, onMounted } from "vue";
// 定义组件属性
const props = defineProps({
  // title: {
  //   type: String,
  //   default: "标题",
  // },
  // leftIconSize: {
  //   type: Number,
  //   default: 20,
  // },
});
const tabbarList = ref([
  { text: "购物", icon: "home" },
  { text: "分类", icon: "photo" },
  { text: "我的", icon: "account" },
]);
const tabbarValue = ref(0);
const tabbarChange = (e) => {
  console.log(e);
};
</script>

<style lang="scss" scoped></style>
